CSS 命名規則的目的是提高代碼的可讀性和可維護性，讓開發者在管理和擴展樣式時更加高效。這些規則包括以下幾個關鍵要素：

1. 小寫字母與連字號

最常見的命名方式是使用小寫字母，並以連字號（-）分隔單詞，如 main-header 或 footer-links。這樣的命名方式具有良好的可讀性，並且可以避免與 JavaScript 中的變數命名相混淆。

2. 描述性命名

CSS 的類別和 ID 名稱應具有描述性，反映元素的功能或用途，而不是外觀。例如，btn-primary 比blue-button更具描述性，因為前者表示按鈕的用途，而後者僅僅描述了顏色。這樣的命名方式使得即使樣式變更，命名仍然具有意義，避免了未來的重構困難。

3. 避免使用大寫字母

在 CSS 中，命名通常只使用小寫字母和連字號，建議避免使用大寫字母，以保持命名一致性。

4. BEM 命名法

BEM（Block, Element, Modifier）是一種廣泛應用的命名規則，有助於構建結構化的、可重用的 CSS。BEM 將名稱分為區塊（Block）、元素（Element）和修飾符（Modifier）。區塊是頁面上的獨立部分，如 navbar；元素是區塊的子部分，如 navbar__item；修飾符表示元素的不同狀態或版本，如 navbar__item--active。

5. 避免具體描述

避免使用過於具體的名稱，如 red-text 或 large-box，因為這樣的命名在設計變更時容易失去其原本的意義。應該優先使用具有抽象意義的名稱，這樣樣式可以更靈活地應用於不同的情況。

6. 避免深層嵌套

過深的選擇器嵌套會導致樣式難以維護，應盡量保持選擇器的簡潔。這不僅提高了性能，還讓樣式的作用範圍更明確。